<template>
	<view class="container">
		<view class="user-info-section">
			<view class="user-avatar">
				<image class="avatar" :src="userInfo.avatarUrl" mode="aspectFill"></image>
			</view>
			<text class="username">{{ userInfo.nickName || '暂无昵称' }}</text>
		</view>

		<!-- 我的订单 -->
		<view class="functions-section">
			<view class="function-item" @click="goToMyOrders">
				<view class="function-icon">
					<image src="/static/image/icon_appointment.png" mode="aspectFit"></image>
				</view>
				<text class="function-text">我的订单</text>
				<image class="arrow-right" src="/static/image/arrow_right.png" mode="aspectFit"></image>
			</view>
		</view>
		
		<!-- 订单核销（仅管理员可见） -->
		<view class="functions-section" v-if="userInfo.isAdmin">
			<view class="function-item" @click="goToVerificationList">
				<view class="function-icon">
					<image src="/static/image/icon_book.png" mode="aspectFit"></image>
				</view>
				<text class="function-text">订单核销</text>
				<image class="arrow-right" src="/static/image/arrow_right.png" mode="aspectFit"></image>
			</view>
		</view>

		<view class="footer">
			<text class="version">v1.0.0</text>
		</view>
	</view>
</template>

<script setup>
import { ref, onMounted } from 'vue';

const userInfo = ref({
  avatarUrl: '/static/image/table.png', // 使用现有的图片
  nickName: '暂无',
  isAdmin: false // 默认不是管理员
});

// 初始化用户信息
const initUserInfo = () => {
  try {
    // 检查本地存储中是否有用户配置
    const userConfig = uni.getStorageSync('userConfig');
    if (userConfig) {
      userInfo.value = { ...userInfo.value, ...userConfig };
    } else {
      // 模拟默认用户配置
      const defaultUser = {
        avatarUrl: '/static/image/table.png', // 使用现有的图片
        nickName: '测试用户',
        isAdmin: true // 模拟管理员身份，实际项目中应通过后端获取
      };
      userInfo.value = { ...userInfo.value, ...defaultUser };
      // 保存到本地存储
      uni.setStorageSync('userConfig', defaultUser);
    }
  } catch (error) {
    console.error('获取用户配置失败:', error);
  }
};

onMounted(() => initUserInfo());

// 跳转到我的订单
const goToMyOrders = () => {
  uni.navigateTo({ url: '/pages/mine/myOrders' });
};

// 跳转到核销列表（仅管理员可见）
const goToVerificationList = () => {
  if (userInfo.value.isAdmin) {
    uni.navigateTo({ url: '/pages/mine/verificationList' });
  } else {
    uni.showToast({
      title: '仅管理员可访问',
      icon: 'none'
    });
  }
};
</script>

<style lang="scss">
/* 保持原有样式不变 */
.container { min-height: 100vh; background-color: #f5f5f5; }
.user-info-section {
  background-color: #165dff;
  padding: 40px 20px 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  .user-avatar {
    margin-bottom: 20px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    .avatar { width: 100%; height: 100%; border: 2px solid rgba(255, 255, 255, 0.3); }
  }
  .username { color: #fff; font-size: 20px; font-weight: bold; }
}
.functions-section {
  background-color: #fff;
  margin-top: 10px;
  .function-item {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    border-bottom: 1px solid #eee;
    .function-icon {
      width: 24px;
      height: 24px;
      margin-right: 15px;
      image { width: 100%; height: 100%; }
    }
    .function-text { flex: 1; font-size: 16px; color: #333; }
    .arrow-right { width: 15px; height: 15px; }
  }
}
.footer { text-align: center; margin-top: 30px; .version { font-size: 12px; color: #999; } }
</style>